<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 一个整体的背景 */
        .wrapper{
            width: 500px;
            height: 632px;
            background-image: url(./img/7.webp);
            /* 背景位置固定 */
            background-attachment: fixed;
            border: 5px solid rgba(173, 255, 190, 0.752);
        }
        /* 内部文本的样式 */
        .content>p{
            display: block;
            margin-left: 30px;
            margin-right: 30px;
            text-align: center;
            font-size: 30px;
            font-family: monospace;
            font-style: italic;
            font-weight: bold;
            color: rgb(0, 0, 0);
        }
        /* 内容框的样式 */
        .content{
            margin: 100px auto;
            width: 500px;
            position: absolute;
            z-index: 1;
            overflow: hidden;
        }
        /* 伪元素法：添加一个相同背景的伪元素，用于毛玻璃设置 */
        .content::before{
            content: '';
            position: absolute;
            z-index: -1;
            width: 500px;
            height: 632px;
            top: 0;
            left: 0;
            /* 相同的背景 */
            background-image: url(./img/7.webp);
            /* 相同的位置 */
            background-attachment: fixed;
            /* 模糊效果 */
            filter: blur(20px);
            /* 添加外边距让模糊边缘被剪裁掉 */
            margin: -30px;
        }

    </style>
</head>
<body>
    <div class="wrapper">
        <div class="content">
            <p>The only way to get rid of a temptation is to yield to it.
                Resist it, and your soul grows sick with longing for the 
                things it has forbidden to itself, with  desire for what 
                its monstrous laws have made monstrous and unlawful.
            </p>
        </div>
    </div>
</body>
</html>